.center-box01 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 400px;
  height: 300px;
  margin-left: -200px;
  margin-top: -150px;
  background-color: #bfa;
}
.box01 {
  border: 1px solid #999;
  text-align: center;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 400px;
  height: 300px;
  margin-left: -200px;
  margin-top: -150px;
  background-color: #bfa;
}
/*.......................................*/
.box02 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 400px;
  height: 300px;
  margin-left: -200px;
  margin-top: -150px;
  background-color: #bfa;
  border: 1px solid #ccc;
}
/*.......................................*/
.box03 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 200px;
  height: 400px;
  margin-left: -100px;
  margin-top: -200px;
  background-color: #ff9900;
}
/*.......................................*/
.box04 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 300px;
  height: 100px;
  margin-left: -150px;
  margin-top: -50px;
  background-color: #ff0000;
}
/*.......................................*/
.box05 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 500px;
  height: 400px;
  margin-left: -250px;
  margin-top: -200px;
  background-color: #bbffaa;
}
/*.......................................*/
.box06 {
  -webkit-transition: 2s width ease 5s;
  -moz-transition: 2s width ease 5s;
  transition: 2s width ease 5s;
}
.box7 {
  -webkit-transition: 2s width, height ease 5s;
  -moz-transition: 2s width, height ease 5s;
  transition: 2s width, height ease 5s;
}
